import styled from 'styled-components'
export const Wrapper = styled.div`
    .sale-box{
    height: 550px;
    // overflow: hidden;
    padding-bottom: 1.28rem;
    padding-bottom: 12.8vw;
    background-color: #fff;
    background: #fff!important;
    .sale-main{
    display: -webkit-flex;
    display: flex;
    height: 100%;
    .sale-left{
    overflow-y: auto;
    height: 100%;
    background-color: #f8f8f8;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 1.066667rem;
    padding-bottom: 10.666667vw;
    ul{
    flex: none;
    position: relative;
    z-index: 0;
    list-style: none;
    a{
    display: block;
    position: relative;
    padding: .466667rem .2rem;
    padding: 4.666667vw 2vw;
    font-size: .128rem;
    color: #333;
    background-color: #fff;
    span{
    font-size: .128rem;
    color: #000;
    }
    }
    }
    }
    }
    
    }
    
    .sale-detail-box{
    position: relative;
    height: 100%;
    width: 3.18rem;
    // width: 31.8vw;
    .sale-detail{
    height: 100%;
    padding-bottom: 0.424rem;
    padding-bottom: 4.24vw;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    }
    }
    .menu-box{
    height: 100%;
    padding-bottom: 0.424rem;
    padding-bottom: 4.24vw;
    overflow-y: auto;
    .menu-detail{
    margin: 0;
    padding: 0;
    display: block;
    margin-block-start: 0.25em;
    margin-block-end: 0.25em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    }
    }
    .menu-top{
    position: relative;
    margin-left: .1rem;
    margin-left: 1vw;
    padding: .08rem .32rem .08rem 0;
    padding: 0.8vw 0.32vw 0.8vw 0;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    overflow: hidden;
    .top-title{
    margin-right: .05rem;
    margin-right: 0.5vw;
    font-weight: 700;
    font-size: .128rem;
    color: #666;
    -webkit-flex: none;
    flex: none;
    }
    span{
    display: block;
    -webkit-flex: 1;
    flex: 1;
    color: #999;
    font-size: .1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    }
    }
    .menu-item{
    height: auto!important;
    display: flex;
    section{
    -webkit-flex: 1;
    flex: 1;
    position: relative;
    padding-bottom: .666667rem;
    padding-bottom: 6.666667vw;
    padding-right: .4rem;
    padding-right: 4vw;
    .fooddetail-info{
    position: relative;
    padding-right: .4rem;
    padding-right: 4vw;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: start;
    align-items: start;
    span{
    font-weight: 700;
    overflow: hidden;
    font-size: .14rem;
    white-space: nowrap;
    width: 1.6rem;
    width: 16vw;
    text-overflow: ellipsis;
    }
    }
    .fooddetail-sale{
    margin: .173333rem 0!important;
    margin: 1.733333vw 0!important;
    color: #999;
    font-size: .1rem;
    line-height: 1;
    min-height: 1em;
    span:nth-of-type(1){
    vertical-align: middle;
    }
    span:nth-of-type(2){
    margin-left: 1.066667vw;
    vertical-align: middle;
    }
    }
    .fooddetail-sale{
    display: flex;
    }
    .sale_price{
    font-size: .16rem;
    line-height: .426667rem;
    line-height: 4.266667vw;
    color: #ff5339;
    padding-bottom: .093333rem;
    padding-bottom: .933333vw;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: baseline;
    align-items: baseline;
    position: absolute;
    bottom: 0;
    span{
    margin-right: .266667vw;
    }
    }
    .food-btn{
    position: absolute;
    right: .4rem;
    right: 4vw;
    bottom: .066667rem;
    bottom: .666667vw;
    span{
    display: inline-flex;
    font-size: .18rem;
    width: 0.2rem;
    height: 0.2rem;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    background: rgb(35, 149, 255);
    border-radius: 50%;
    color:#fff;
    }
    }
    }
    }
    .img-box{
    width: 2.533333rem;
    width: 25.333333vw;
    height: 2.8rem!important;
    height: 28vw!important;
    -webkit-flex: none;
    flex: none;
    margin-right: .266667rem;
    margin-right: 2.666667vw;
    position: relative;
    }
    .sale-img{
    width: 100%;
    border-radius: .053333rem;
    border-radius: .533333vw;
    }
    //footer
    .footer-box{
    z-index: 11;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    padding-left: 2.106667rem;
    padding-left: 21.066667vw;
    background-color: rgba(61,61,63,.9);
    -webkit-backdrop-filter: blur(.266667rem);
    -webkit-backdrop-filter: blur(2.666667vw);
    height: 1.28rem;
    height: 12.8vw; 
    a{
    text-decoration: none;
    height: 100%;
    width: 2.8rem;
    width: 28vw;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: .2rem;
    font-weight: 700;
    -webkit-user-select: none;
    user-select: none;
    line-height: 1.28rem;
    line-height: 12.8vw;
    
    }
    }
    .footer-text{
    flex: 1;
    p:nth-of-type(1){
    font-size: .2rem;
    line-height: normal;
    color: #fff;
    margin: 0;
    font-weight: 400;
    span{
    font-size: .7em;
    color: #999;
    }
    }
    p:nth-of-type(2){
    color: #999;
    font-size: .1rem;
    margin: 0;
    font-weight: 400;
    }
    }
    .detail-send{ 
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: .16rem;
    font-weight: 700;
    -webkit-user-select: none;
    user-select: none;
    line-height: 1.28rem;
    line-height: 12.8vw;
    }
    .footer-top{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease,-webkit-transform .3s ease;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    bottom: 1.8rem;
    bottom: 18vw;
    z-index: 11;
    section{
    background-color: #fffad6;
    border-top: .013333rem solid #f9e8a3;
    border-top: .133333vw solid #f9e8a3;
    opacity: .96;
    line-height: .533333rem;
    line-height: 5.333333vw;
    font-size: .1rem;
    text-align: center;
    span{
    color: #333333;
    }
    }
    } `